﻿<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <meta charset="utf-8" />
    <script src="https://cdn.bootcss.com/html2canvas/0.5.0-beta4/html2canvas.js"></script>
</head>
<body>
    <div class="code-list">
    </div>
    <link rel="stylesheet" href="/print/print.css?v=1.0.2" media="all">
    <script type="text/javascript" src="/print/jquery.min.js"></script>
    <script type="text/javascript" src="/print/qrcode.min.js"></script>
    <script type="text/javascript" src="/print/jquery-barcode.js"></script>
    <script>
        var type = GetQueryValue("type");//0--前五个，1--物品标签，2--位置标签
        var v1 = GetQueryValue("v1");
        var v2 = GetQueryValue("v2");
        var v3 = GetQueryValue("v3");
        var v4 = GetQueryValue("v4");
        var v5 = GetQueryValue("v5");
        var v6 = GetQueryValue("v6");
        var v7 = GetQueryValue("v7");
        console.log(v1);
        $(function () {
            getCodeList(v1, v2, v3, v4, v5, v6, v7);
        })
        function GetQueryValue(queryName) {
            var reg = new RegExp("(^|&)" + queryName + "=([^&]*)(&|$)", "i");
            var r = window.location.search.substr(1).match(reg);
            if (r != null) {
                return decodeURI(r[2]);
            } else {
                return null;
            }
        }
        function getCodeList(val1, val2, val3, val4, val5, val6, val7) {
            $.ajax({
                url: '/print/data.ashx?oper=getCodeList',
                type: 'get',
                async: true,
                data: {
                    val1: val1,
                    val2: val2,
                    val3: val3,
                    val4: val4,
                    val5: val5,
                    val6: val6,
                    val7: val7
                },
                dataType: 'json'
            }).then(function (res) {
                console.log(res);
                if (res.status == "1") {
                    var result = res.result;
                    if (result.length > 0) {
                        setJson(result);
                    }
                    else {
                        $(".code-list").html("未查询到数据");
                    }
                }
                else {
                    layer.msg('系统错误');
                    return false;
                }
            }).fail(function (res) {
                console.log('失败');
                console.log(res.responseText);
            })
        }
        function setJson(json) {
            var _str = '';
            var n = parseInt(type);
            //n = 0;
            switch (n) {
                case 0:
                    //代码块,前五个
                    var result = [];
                    for (var i = 0, len = json.length; i < len; i += 30) {
                        result.push(json.slice(i, i + 30));
                    }
                    console.log(result);
                    _str += '<div class="box1">';
                    $.each(result, function (j, jtem) {
                        _str += '<div class="A4">';
                        for (var k = 0; k < 4; k++) {
                            //_str += '<div class="vertical ver' + (k + 1)+ '"></div>';
                        }
                        $.each(jtem, function (i, item) {
                            _str += '<div class="box" data-index=' + i + '>'
                                + '<div class="qrcode"><span class="cnaidc" id="' + item.code + '" data-code="' + item.code + '"></span><h5>' + item.name + '</h5></div></div>'
                            if ((i + 1) % 5 == 0) {
                                //_str += '<hr />';
                            }
                        })
                        _str += '</div>';
                    })
                    _str += '</div>';
                    break;
                case 1:
                    //代码块,物品标签
                    var result = [];
                    for (var i = 0, len = json.length; i < len; i += 12) {
                        result.push(json.slice(i, i + 12));
                    }
                    console.log(result);
                    _str += '<div class="box2">';
                    //$.each(result, function (j, jtem) {
                        _str += '<div class="A4">';
                        $.each(result[0], function (i, item) {
                            _str += '<div class="box" data-index=' + i + '><div class="inbox">'
                                + '<div class="qrcode"><span class="cnaidc" id="' + item.labelcode + '" data-code="' + item.labelcode + '"></span><h5>' + item.labelcode + '</h5></div>'
                                + '<div class="info"><h6 class="name">名称：' + item.name + '</h6><span>规格型号：' + item.spec + ' ' + item.model + '</span><p>位置：' + item.position + '</p></div></div></div>'
                            if ((i + 1) % 2 == 0) {
                                //_str += '<hr />';
                            }
                        })
                        _str += '</div>';
                   // })

                    _str += '</div>';
                    break;
                case 2:
                    //代码块,位置标签
                    var result = [];
                    for (var i = 0, len = json.length; i < len; i += 30) {
                        result.push(json.slice(i, i + 30));
                    }
                    console.log(result);
                    _str += '<div class="box1">';
                    $.each(result, function (j, jtem) {
                        _str += '<div class="A4">';
                        for (var k = 0; k < 4; k++) {
                            //_str += '<div class="vertical ver' + (k + 1) + '"></div>';
                        }
                        $.each(jtem, function (i, item) {
                            _str += '<div class="box" data-index=' + i + '>'
                                + '<div class="qrcode"><h5>' + item.name + '</h5><span class="cnaidc" id="' + item.code + '" data-code="' + item.code + '"></span></div></div>'
                            if ((i + 1) % 5 == 0) {
                                _str += '<hr />';
                            }
                        })
                        _str += '</div>';
                    })
                    _str += '</div>';
                    break;
                default:
                    // 默认代码块
            }

            $(".code-list").html(_str);
            //setBarCode();
            setQRCode();
        }
        function setBarCode() {
            var settings = {
                output: 'css',
                color: '#000',
                barWidth: 2,
                barHeight: 30,
                displayValue: true,
                fontOptions: "bold",
                fontSize: 16,
                moduleSize: 5,
                addQuietZone: 10
            };
            $.each($(".code-list .box .cnaidc"), function () {
                var _code = $(this).data("code");
                console.log(_code);
                $(this).barcode(_code.toString(), "code128", settings);
            })

            setTimeout(function () {
                window.print();
            }, 20)

        }
        function setQRCode() {
            $.each($(".code-list .box .cnaidc"), function () {
                var _code = $(this).data("code");
                if (!_code) {
                    return false;
                } else {
                    new QRCode(document.getElementById(_code), _code);
                }
            })
            //generateImg();//--生成图片
            setTimeout(function () {
                //window.print();
            }, 20)
        }
        function generateImg() {
            $.each($(".code-list .box"), function () {
                html2canvas($(this)).then(function (canvas) { document.body.appendChild(canvas); });
            })
            setTimeout(function () {
                //window.print();
            }, 20)
        }
    </script>
</body>
</html>
